<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            width: 3000px;
            height: 3000px;
        }
    </style>
    <script>
        
    </script>
</head>
<body>
    <script>
        // 事件就是用户的一个交互动作 
        // 监听事件  监控用户的一个动作  
        // 使用的过程中  是 on+事件名
        // 如果事件被触发 会执行一段代码  
        // var res = document.getElementById('two').innerHTML;
        // alert(res); 直接这么查找 找不到   
        // 因为id为two的标签还没加载完  


        // 1. load 
        // 加载 
        // window.onload
        // window.onload = function(){ 
        //     // 当整个页面的标签等加载完毕 这里边的代码才被执行 
        //     var res = document.getElementById('two').innerHTML;
        //     alert(res);
        // }

        // 2.scroll
        // 滚动条 
        // window.onscroll
        // window.onscroll = function(){
        //     console.log(666) // 只要滚动条动 立马打印 
        // }
        // 3.resize 
        // 调整尺寸  
        // window.onresize 

        // window.onresize = function(){
        //     alert(888); // 只要调整浏览器窗口的尺寸 不管上下还是左右
        //     // 都会触发
        // }
    </script>
    <h2 id="two">这是我的二级标题</h2>

</body>
</html>